<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" href="../../component/pear/css/pear.css" />
		<link rel="stylesheet" href="../../assets/css/other/department.css"/>
		<style>
			.layui-form-label {
				width: 100px;
			}
			.layui-input-block {
				margin-left: 130px;
			}
			.layui-form-item .layui-input-inline {
				width: 280px;
			}
		</style>
	</head>
	<body class="pear-container">
		<div class="layui-card">
			<div class="layui-card-body">
				<form class="layui-form" lay-filter="form-filter">
					<div class="layui-form-item">
						<div class="layui-form-item layui-inline layui-hide">
							<label class="layui-form-label">表名称</label>
							<div class="layui-input-inline">
								<input type="text" name="tableName" placeholder="" class="layui-input" disabled>
							</div>
						</div>
						<div class="layui-form-item layui-inline">
							<label class="layui-form-label">所有表字段</label>
							<div class="layui-input-inline">
								<input type="text" name="tableColumns" placeholder="" class="layui-input" disabled>
							</div>
						</div>
						<div class="layui-form-item layui-inline">
							<label class="layui-form-label">实体类忽略字段</label>
							<div class="layui-input-inline">
								<input type="text" name="ignoredColumns" placeholder="" class="layui-input">
							</div>
						</div>
						<div class="layui-form-item layui-inline">
							<label class="layui-form-label">包路径</label>
							<div class="layui-input-inline">
								<input type="text" name="packagePath" placeholder="" class="layui-input">
							</div>
						</div>
						<div class="layui-form-item layui-inline">
							<label class="layui-form-label">实体类名称</label>
							<div class="layui-input-inline">
								<input type="text" name="entityName" placeholder="" class="layui-input">
							</div>
						</div>
						<div class="layui-form-item layui-inline">
							<label class="layui-form-label">作者</label>
							<div class="layui-input-inline">
								<input type="text" name="author" placeholder="" class="layui-input">
							</div>
						</div>
						<div class="layui-form-item layui-inline">
							<button class="pear-btn pear-btn-md pear-btn-primary" lay-submit lay-filter="execute-generate">
								<i class="layui-icon layui-icon-play"></i>生成代码到项目工程
							</button>
							<button type="reset" class="pear-btn pear-btn-md layui-hide">
								<i class="layui-icon layui-icon-refresh"></i>重置
							</button>
						</div>
					</div>
				</form>
			</div>
		</div>
		<div class="layui-row layui-col-space15">
			<div class="layui-col-md3">
				<div class="layui-card">
					<div class="layui-card-body">
						<div id="templateTreeContent" style="overflow: auto">
							<ul id="templateTree" class="dtree templateTree" data-id="9527"></ul>
						</div>
					</div>
				</div>
			</div>
			<div class="layui-col-md9">
				<div class="layui-card">
					<div class="layui-card-body">
						<div id="generator_template_gen_hint" style="margin-top: 30px;">
							<div style="height: 300px;">
								<div style="border: 1px solid #dadada; border-radius:30px; margin: 0 30px; padding: 50px 100px;">
									<i class="pear-icon pear-icon-direction-left"></i> 想预览生成的代码内容？试试点击左侧树列表。<br>
									想快速生成代码到本地项目工程目录？试试点击
									<button class="pear-btn pear-btn-md pear-btn-primary" lay-submit lay-filter="execute-generate">
										<i class="layui-icon layui-icon-play"></i>生成代码到项目工程
									</button> 按钮。<br>
									想自定义代码模板？点击
									<button class="pear-btn pear-btn-md pear-btn-primary" lay-submit lay-filter="document">
										<i class="layui-icon layui-icon-form"></i>查看文档
									</button> 按钮。
								</div>
							</div>
						</div>
						<div id="generator_template_gen_code" style="display: none;">
							<div style="text-align: left;">
								<button class="layui-btn layui-btn-normal pear-btn-xs" lay-template-event="copy"><i class="fa-solid fa-clone"></i> 复制代码</button>
								<span style="margin-left: 10px;" id="generatedFileName"></span>
							</div>
							<textarea name="code" rows="20" disabled class="layui-textarea" style="background: #3f3f3f; color: #c2be9e;"></textarea>
						</div>
					</div>
				</div>
			</div>
		</div>
		
		<script src="../../component/layui/layui.js"></script>
		<script src="../../component/pear/pear.js"></script>
		<script>
			layui.use(['form', 'jquery', 'dtree', 'util'], function() {
				let form = layui.form;
				let $ = layui.jquery;
				let dtree = layui.dtree;
				let util = layui.util;

				let url = layui.url();

				let tableName = url.search.name;

				var DTree = dtree.render({
					elem: "#templateTree",
					//data: data,
					initLevel: "2", //默认展开层级为1
					line: true, // 有线树
					ficon: ["1", "-1"], // 设定一级图标样式。0表示方形加减图标，8表示小圆点图标
					icon: ["0", "2"], // 设定二级图标样式。0表示文件夹图标，5表示叶子图标
					method: 'get',
					url: $.vtl.getApiRootPath() + "/zmx/generator/template/tree"
				});

				// 绑定节点点击事件
				dtree.on("node(templateTree)", function(obj) {
					if (!obj.param.leaf) {
						var $div = obj.dom;
						DTree.clickSpread($div); //调用内置函数展开节点
					} else {
						//layer.msg("叶子节点就不展开了,刷新右侧列表");
						$('#generator_template_gen_hint').hide();
						$('#generator_template_gen_code').show();
						window.execute(obj.param.nodeId);

						let tplName = obj.param.context;
						let fileName = tplName.replace('{EntityName}', $("form input[name='entityName']").val());
						$('#generatedFileName').text(fileName)
					}
				});

				form.on('submit(execute-generate)', function(data) {
					window.openTemplateSelector();
					return false;
				});

				form.on('submit(document)', function(data) {
					top.layui.admin.jump('-2', '代码生成器（文档）', 'views/generator/document.html')
					return false;
				});

				util.event('lay-template-event', {
					copy: function(othis) {
						let $code = $("textarea[name='code']");
                    	$.vtl.copyToClip($code.text());
					}
				});

				window.execute = function(templateTreeId) {
					let config = form.val("form-filter");
					$.ajax({
						url: "/zmx/generator/execute/" + tableName,
						data: JSON.stringify({ templateIdList: [ templateTreeId ], config: config }),
						dataType: 'text',
						contentType: 'application/json',
						type: 'post',
						success: function(result) {
							$("textarea[name='code']").text(result);
						}
					})
				}

				window.openTemplateSelector = function() {
					let config = form.val("form-filter");
					layer.open({
						type: 2,
						title: '表名称【' + config.tableName + '】',
						shade: [0.5, "#393D49"],
						closeBtn: 1,
						shadeClose: true,
						maxmin: true,
						resize: false,
						area: ['800px', '450px'],
						content: 'templateSelector.html?' + $.vtl.buildQueryVariable(config)
					});
				}

				window.initFormValue = function(tableName) {
					$.ajax({
						url: "/zmx/generator/config/default/" + tableName,
						dataType: 'json',
						type: 'get',
						success: function(result) {
							form.val("form-filter", {
								"tableName": result.name
								,"tableColumns": result.fieldNames
								,"ignoredColumns": result.ignoredColumns
								,"entityName": result.entityName
								,"packagePath": result.packagePath
								,"author": result.author
							});
						}
					})
				}

				window.initFormValue(tableName);
			})
		</script>
	</body>
</html>
